/* =========================================================
   Therapy Board — bulletin-wall page styles
   Inherits brand.css + brand-v2.css. Adds wall + card vocabulary.
   ========================================================= */

.board-page{background:var(--noir);color:var(--paper);min-height:100vh}

/* Re-skin the global grain to read on dark */
body.board-page::after{
  opacity:.22;
  mix-blend-mode:screen;
}

/* The "wall" — full-bleed noir with halftone + scuffs */
.board-page::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse at 15% 8%, oklch(28% 0.06 198 / .55), transparent 40%),
    radial-gradient(ellipse at 88% 92%, oklch(28% 0.08 38 / .35), transparent 45%),
    radial-gradient(ellipse at 50% 50%, oklch(16% 0.02 200 / .85), oklch(8% 0.01 200) 80%);
}
.board-page > *{position:relative;z-index:1}

/* =========================================================
   STICKY HEADER
   ========================================================= */
.bd-top{position:sticky;top:0;z-index:80;background:rgba(13,11,9,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--rule-dark-soft)}
.bd-bar{max-width:1480px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.bd-brand{text-decoration:none;color:var(--paper);display:flex;flex-direction:column;gap:2px;line-height:1}
.bd-brand .lk-word{font-size:18px;color:var(--paper)}
.bd-brand .lk-tag{font-family:var(--f-mono);font-size:9px;letter-spacing:.32em;color:rgba(244,236,218,.55);margin-top:2px}
.bd-crumbs{font-family:var(--f-mono);font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:rgba(244,236,218,.55);display:flex;align-items:center;gap:10px}
.bd-crumbs a{color:rgba(244,236,218,.55);text-decoration:none}
.bd-crumbs a:hover{color:var(--teal-300)}
.bd-crumbs .here{color:var(--paper)}
.bd-top .btn-ghost{border-color:rgba(244,236,218,.4);color:var(--paper)}
.bd-top .btn-ghost:hover{background:var(--paper);color:var(--ink)}

/* =========================================================
   HERO — paper card pinned to noir wall
   ========================================================= */
.bd-hero{max-width:1480px;margin:0 auto;padding:48px 32px 8px}
.bd-paper-card{background:var(--paper);color:var(--ink);border-radius:6px;padding:38px 40px;position:relative;box-shadow:0 30px 60px -30px rgba(0,0,0,.7), 0 6px 0 rgba(0,0,0,.25)}
.bd-paper-card::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:6px;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .35 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode:multiply;opacity:.4;
}
.hero-grid{display:grid;grid-template-columns:1fr auto;gap:32px;align-items:end;position:relative;z-index:1}
.bd-h1{font-family:var(--f-display);font-weight:400;font-size:clamp(48px,7vw,92px);line-height:.92;letter-spacing:-.015em;margin:14px 0 18px;color:var(--ink)}
.bd-h1 .italic{color:var(--teal-700);font-family:var(--f-serif);font-size:1em}
.hero-card .lede{color:var(--ink-2);max-width:60ch;font-size:18px}
.hero-meta{display:flex;gap:34px;margin-top:24px;flex-wrap:wrap;padding-top:18px;border-top:1px dashed var(--rule)}
.hero-meta span{display:flex;flex-direction:column;gap:2px}
.hero-meta b{font-family:var(--f-display);font-size:24px;line-height:1;color:var(--ink)}
.hero-meta i{font-style:normal;font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:6px}
.hero-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;text-align:right}
.hero-stamp .hand{font-family:var(--f-hand);font-size:48px;line-height:.9;color:var(--ink);display:block;margin-bottom:6px}
.hero-stamp .kicker{font-family:var(--f-mono);font-size:10px;letter-spacing:.22em;color:var(--ink-soft)}

/* =========================================================
   TONIGHT + WEEKEND headline boards
   ========================================================= */
.bd-boards{max-width:1480px;margin:0 auto;padding:36px 32px 0;display:grid;grid-template-columns:1.35fr 1fr;gap:28px;position:relative;z-index:5}
@media (max-width:1080px){.bd-boards{grid-template-columns:1fr}}

.board-card{position:relative;border-radius:8px;padding:26px 28px;box-shadow:0 28px 54px -28px rgba(0,0,0,.7), 0 6px 0 rgba(0,0,0,.25)}
.board-card::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:8px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .35 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");mix-blend-mode:multiply;opacity:.35;z-index:0}
.board-card > *{position:relative;z-index:1}

.board-card.tonight{background:radial-gradient(ellipse at 88% 12%, oklch(40% 0.14 38 / .35), transparent 45%), radial-gradient(ellipse at 10% 90%, oklch(35% 0.10 200 / .35), transparent 50%), linear-gradient(180deg, #1a1612, #0a0908);color:var(--paper);border:1px solid rgba(244,236,218,.08);transform:rotate(-.6deg)}
.bc-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-bottom:14px;border-bottom:1px dashed rgba(244,236,218,.2);margin-bottom:18px;flex-wrap:wrap}
.bc-eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--rust-300);display:inline-flex;align-items:center;gap:10px}
.bc-now{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(244,236,218,.55)}
.live-dot{width:9px;height:9px;border-radius:99px;background:#ff5a3d;box-shadow:0 0 0 3px rgba(255,90,61,.25);animation:gif-pulse 1.4s ease-in-out infinite}
.bc-dotty{width:9px;height:9px;border-radius:99px;background:var(--teal-500);box-shadow:0 0 0 3px rgba(31,140,140,.3)}

.bc-body{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:start}
@media (max-width:680px){.bc-body{grid-template-columns:1fr}}

.bc-flyer{position:relative;transform:rotate(-3deg)}
.fl-mini{background:#0a0908;color:var(--paper);padding:14px 12px;aspect-ratio:.72/1;border-radius:3px;box-shadow:0 12px 20px -8px rgba(0,0,0,.7), 0 1px 0 rgba(0,0,0,.4);position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;border:1px solid rgba(244,236,218,.1)}
.fl-mini::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4'><circle cx='2' cy='2' r='.7' fill='%23000' opacity='.5'/></svg>");mix-blend-mode:multiply;pointer-events:none;z-index:1}
.fl-mini > *{position:relative;z-index:2}
.fl-mini-top{font-family:var(--f-mono);font-size:8px;letter-spacing:.22em;color:var(--teal-300)}
.fl-mini-title{font-family:var(--f-display);font-size:24px;line-height:.92;letter-spacing:-.01em;color:var(--paper);margin-top:6px}
.fl-mini-title span{color:var(--rust-500)}
.fl-mini-slash{height:8px;background:var(--rust-500);transform:skewY(-10deg);margin:14px -10px 6px;box-shadow:0 5px 0 var(--rust-700)}
.fl-mini-djs{font-family:var(--f-display);font-size:13px;line-height:1.05;margin-top:auto;color:var(--paper)}
.fl-mini-djs em{font-style:normal;color:var(--rust-300)}
.fl-mini-foot{font-family:var(--f-mono);font-size:7px;letter-spacing:.18em;color:rgba(244,236,218,.6);margin-top:8px;padding-top:6px;border-top:1px solid rgba(244,236,218,.18)}

.bc-info .bc-h{font-family:var(--f-display);font-weight:400;font-size:clamp(28px,3.4vw,42px);line-height:.95;letter-spacing:-.01em;color:var(--paper);margin:0 0 8px}
.bc-info .bc-h .italic{color:var(--teal-300);font-family:var(--f-serif);font-size:1em}
.bc-info .bc-line{color:rgba(244,236,218,.7);margin:0 0 18px;font-size:15px;line-height:1.5}
.bc-djs{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.bc-dj{display:flex;align-items:center;gap:12px;padding:10px 12px;background:rgba(244,236,218,.05);border:1px solid rgba(244,236,218,.08);border-radius:8px}
.bc-av{width:38px;height:38px;border-radius:99px;flex:none;border:1px solid rgba(244,236,218,.2)}
.bc-av.sm{width:26px;height:26px}
.bc-dj > div{flex:1}
.bc-dj b{font-family:var(--f-display);font-size:15px;letter-spacing:.02em;display:block;color:var(--paper)}
.bc-dj .bc-meta{font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;color:rgba(244,236,218,.55);text-transform:uppercase;display:block;margin-top:2px}
.bc-time{font-family:var(--f-display);font-size:18px;color:var(--teal-300);letter-spacing:0;font-variant-numeric:tabular-nums}

.bc-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-top:14px;border-top:1px dashed rgba(244,236,218,.18)}
.bc-actions .btn-ghost{border-color:rgba(244,236,218,.4);color:var(--paper)}
.bc-actions .btn-ghost:hover{background:var(--paper);color:var(--ink)}
.bc-rsvps{margin-left:auto;color:rgba(244,236,218,.55)}
.bc-rsvps b{color:var(--paper);font-family:var(--f-display);font-weight:400}

.board-card.weekend{background:#f3ecdc;color:var(--ink);border:1px solid var(--rule);transform:rotate(.7deg)}
.board-card.weekend .bc-eyebrow{color:var(--teal-700)}
.board-card.weekend .bc-now{color:var(--ink-soft)}
.board-card.weekend .bc-head{border-bottom-color:var(--rule)}

.wk-list{display:flex;flex-direction:column;gap:10px}
.wk-row{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;background:var(--paper);border:1px solid var(--rule-soft);border-radius:8px;padding:12px}
.wk-date{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--ink);color:var(--paper);padding:8px 0;border-radius:6px}
.wk-date i{font-style:normal;font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;color:rgba(244,236,218,.6)}
.wk-date b{font-family:var(--f-display);font-size:24px;line-height:1}
.wk-date u{text-decoration:none;font-family:var(--f-mono);font-size:8px;letter-spacing:.18em;color:rgba(244,236,218,.6)}
.wk-meta b{font-family:var(--f-display);font-size:16px;letter-spacing:.005em;color:var(--ink);display:block;margin:3px 0}
.wk-tag{display:inline-block;font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:#fff;background:var(--teal-500);padding:2px 7px;border-radius:99px}
.wk-tag.rust{background:var(--rust-500);color:#1a0f08}
.wk-tag.soft{background:transparent;color:var(--ink-soft);border:1px solid var(--rule)}
.wk-line{font-family:var(--f-mono);font-size:10px;letter-spacing:.14em;color:var(--ink-soft);text-transform:uppercase;display:block}
.wk-avs{display:flex;align-items:center}
.wk-avs .bc-av{margin-left:-8px;border-color:var(--paper)}
.wk-avs .bc-av:first-child{margin-left:0}
.wk-foot{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;border-top:1px dashed var(--rule);gap:10px;flex-wrap:wrap}
.wk-foot .kicker{color:var(--ink-soft)}
@media (max-width:520px){.wk-row{grid-template-columns:54px 1fr}.wk-avs{grid-column:1 / -1;margin-top:6px}}

/* =========================================================
   COMPOSER
   ========================================================= */
.bd-composer-wrap{max-width:1480px;margin:0 auto;padding:32px 32px 24px;position:relative;z-index:5}
.composer{background:#f3ecdc;color:var(--ink);border-radius:6px;padding:22px 26px 22px;position:relative;box-shadow:0 24px 48px -28px rgba(0,0,0,.7), 0 4px 0 rgba(0,0,0,.2)}
.composer::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:6px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .3 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode:multiply;opacity:.45;
}
.composer > *{position:relative;z-index:1}

/* Tape strips at top corners */
.tape{position:absolute;width:108px;height:26px;background:rgba(31,140,140,.32);border-top:1px solid rgba(20,17,14,.18);border-bottom:1px solid rgba(20,17,14,.18);box-shadow:0 2px 6px rgba(0,0,0,.18);z-index:3}
.tape.tape-top{top:-14px}
.tape.tape-l{left:38px;transform:rotate(-4deg)}
.tape.tape-r{right:38px;transform:rotate(4deg);background:rgba(200,105,58,.32)}
.tape.tape-corner{width:74px;height:22px}
.tape.tape-tl{top:-10px;left:-8px;transform:rotate(-32deg)}
.tape.tape-tr{top:-10px;right:-8px;transform:rotate(32deg);background:rgba(200,105,58,.32)}
.tape.tape-bl{bottom:-10px;left:14px;transform:rotate(-12deg)}

.cmp-head{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}
.cmp-tabs{display:flex;gap:6px;flex-wrap:wrap}
.cmp-tab{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:8px 12px;border-radius:99px;border:1px solid transparent;background:transparent;color:var(--ink-soft);cursor:pointer;transition:all .15s ease}
.cmp-tab:hover{background:rgba(20,17,14,.06);color:var(--ink)}
.cmp-tab.active{background:var(--noir);color:var(--paper);border-color:var(--noir)}

.cmp-body{display:grid;grid-template-columns:1fr 280px;gap:24px;align-items:start}
.cmp-input textarea{
  width:100%;min-height:90px;font-family:var(--f-hand);font-size:24px;line-height:1.25;color:var(--ink);
  background:#fff8ea;border:1.5px dashed rgba(20,17,14,.25);border-radius:6px;padding:14px 16px;resize:vertical;outline:none;
}
.cmp-input textarea:focus{border-color:var(--teal-500);background:#fff;box-shadow:0 0 0 3px oklch(60% 0.13 198 / .2)}
.cmp-input textarea::placeholder{color:rgba(20,17,14,.4)}
.cmp-actions{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}
.chip-btn{display:inline-flex;align-items:center;gap:6px;font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;padding:8px 12px;border:1px solid var(--rule);border-radius:99px;background:var(--paper);color:var(--ink-2);cursor:pointer;line-height:1}
.chip-btn:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.cmp-spacer{flex:1}
.cmp-color{display:inline-flex;gap:6px;padding:6px 8px;border:1px solid var(--rule);border-radius:99px;background:var(--paper)}
.cmp-color i{width:18px;height:18px;border-radius:99px;display:block;border:1px solid rgba(20,17,14,.18);cursor:pointer}
.cmp-color i:hover{transform:scale(1.1)}

.cmp-side{display:flex;flex-direction:column;gap:14px}
.cmp-as{display:flex;align-items:center;gap:12px;padding:12px;background:var(--paper);border:1px solid var(--rule-soft);border-radius:8px}
.cmp-avatar{width:42px;height:42px;border-radius:99px;flex:none;border:1px solid var(--rule)}
.cmp-as b{font-family:var(--f-display);font-size:14px;letter-spacing:.01em;color:var(--ink)}
.cmp-as u{font-family:var(--f-mono);font-size:13px;color:var(--teal-700);text-decoration:none;letter-spacing:.04em}
.cmp-as .small{display:block;margin-top:2px;font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft)}
.cmp-hint{color:var(--ink-soft);line-height:1.5}

@media (max-width:900px){.cmp-body{grid-template-columns:1fr}.cmp-head{flex-direction:column;align-items:flex-start}}

/* =========================================================
   FILTERS
   ========================================================= */
.bd-filters{display:flex;align-items:center;gap:8px;margin-top:24px;padding:14px 18px;background:rgba(13,11,9,.6);border:1px solid var(--rule-dark-soft);border-radius:99px;flex-wrap:wrap}
.flt{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:8px 14px;border:1px solid transparent;border-radius:99px;background:transparent;color:rgba(244,236,218,.6);cursor:pointer;display:inline-flex;align-items:baseline;gap:6px;line-height:1;transition:all .15s ease}
.flt em{font-style:normal;font-family:var(--f-display);font-size:11px;color:rgba(244,236,218,.45);letter-spacing:0}
.flt:hover{color:var(--paper);background:rgba(244,236,218,.06)}
.flt.active{background:var(--teal-500);color:#fff;border-color:var(--teal-500)}
.flt.active em{color:rgba(255,255,255,.85)}
.flt-spacer{flex:1}
.flt.sort{color:rgba(244,236,218,.85);border-color:rgba(244,236,218,.18)}

/* =========================================================
   WALL — masonry-ish columns of pinned cards
   ========================================================= */
.bd-wall{max-width:1480px;margin:0 auto;padding:36px 32px 80px;position:relative;min-height:600px}

/* faint texture marks on the dark wall */
.wall-scuff{position:absolute;background:radial-gradient(ellipse,rgba(244,236,218,.06),transparent 70%);pointer-events:none;z-index:0}
.wall-scuff.s1{width:340px;height:240px;top:120px;left:-40px}
.wall-scuff.s2{width:420px;height:300px;top:600px;right:-60px;background:radial-gradient(ellipse,rgba(31,140,140,.07),transparent 70%)}
.wall-scuff.s3{width:280px;height:200px;top:1200px;left:30%}

.wall-pin{position:absolute;width:14px;height:14px;border-radius:99px;background:var(--teal-500);box-shadow:0 0 0 2px rgba(13,11,9,.35), 0 4px 6px rgba(0,0,0,.5), inset -2px -3px 4px rgba(0,0,0,.4), inset 2px 2px 3px rgba(255,255,255,.35);pointer-events:none;z-index:0}
.wall-pin.wp1{top:80px;right:140px;background:var(--rust-500)}
.wall-pin.wp2{top:520px;left:8%}
.wall-pin.wp3{top:980px;right:8%;background:var(--paper)}

.wall-grid{column-count:4;column-gap:28px;column-fill:balance}
@media (max-width:1280px){.wall-grid{column-count:3}}
@media (max-width:900px){.wall-grid{column-count:2}}
@media (max-width:600px){.wall-grid{column-count:1}}

.wall-grid > *{break-inside:avoid;display:block;margin:0 0 36px;position:relative}

.wall-end{margin-top:32px;display:flex;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px dashed var(--rule-dark-soft);gap:16px;flex-wrap:wrap}
.wall-end .btn-ghost{border-color:rgba(244,236,218,.4);color:var(--paper)}
.wall-end .btn-ghost:hover{background:var(--paper);color:var(--ink)}
.wall-end .kicker{color:rgba(244,236,218,.55)}

/* =========================================================
   PIN — the rounded thumbtack used on every card
   ========================================================= */
.pin{
  --pin-c:var(--teal-500);
  position:absolute;top:-8px;left:50%;transform:translateX(-50%);
  width:18px;height:18px;border-radius:99px;
  background:radial-gradient(circle at 35% 30%, color-mix(in oklab, var(--pin-c) 70%, #fff 30%) 0%, var(--pin-c) 55%, color-mix(in oklab, var(--pin-c) 60%, #000 40%) 100%);
  box-shadow:0 0 0 1px rgba(0,0,0,.25), 0 6px 10px rgba(0,0,0,.55), 0 2px 0 rgba(0,0,0,.35);
  z-index:4;pointer-events:none;
}
.pin::after{
  content:"";position:absolute;left:50%;top:80%;transform:translateX(-50%);
  width:4px;height:10px;background:linear-gradient(180deg,rgba(0,0,0,.5),rgba(0,0,0,.15));
  border-radius:2px;
}
.pin.pin-teal{--pin-c:#1F8C8C}
.pin.pin-rust{--pin-c:#C8693A}
.pin.pin-paper{--pin-c:#ECE6D8}
.pin.pin-ink{--pin-c:#221d18}

/* =========================================================
   CARD CHROME — every wall card
   ========================================================= */
.card-wrap{
  --tilt:-2deg;
  transform:rotate(var(--tilt));
  transition:transform .25s ease, box-shadow .25s ease;
  filter:drop-shadow(0 20px 28px rgba(0,0,0,.55));
}
.card-wrap:hover{transform:rotate(0) translateY(-4px);z-index:10}

.card-meta{display:flex;align-items:center;gap:10px;margin-top:10px;padding:6px 4px 0;font-family:var(--f-mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,236,218,.7)}
.card-meta .avatar{width:22px;height:22px;border-radius:99px;flex:none;border:1px solid rgba(244,236,218,.25)}
.card-meta b{color:var(--paper);font-family:var(--f-display);font-size:11px;letter-spacing:.04em;font-weight:400}
.card-meta .dot-sep{opacity:.4}
.card-meta time{color:rgba(244,236,218,.55)}
.card-meta .react{margin-left:auto;display:flex;gap:10px}
.card-meta .react span{display:inline-flex;align-items:center;gap:3px;color:rgba(244,236,218,.7);cursor:pointer}
.card-meta .react span:hover{color:var(--teal-300)}
.card-meta .react i{font-style:normal;color:var(--paper)}

/* =========================================================
   POLAROID CARDS
   ========================================================= */
.card-polaroid{
  background:#f7f1e3;color:var(--ink);
  padding:14px 14px 44px;
  border-radius:2px;
  box-shadow:0 1px 0 rgba(0,0,0,.35), 0 12px 28px -10px rgba(0,0,0,.55);
  position:relative;
}
.card-polaroid::after{
  content:"";position:absolute;inset:0;pointer-events:none;mix-blend-mode:multiply;opacity:.18;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 .55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
.card-polaroid .photo{
  width:100%;aspect-ratio:1/1;background:var(--noir);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
}
.card-polaroid .photo::after{
  content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3' height='3'><circle cx='1.5' cy='1.5' r='.6' fill='%23000' opacity='.4'/></svg>");mix-blend-mode:multiply
}
.card-polaroid .cap{
  position:absolute;left:0;right:0;bottom:10px;text-align:center;
  font-family:var(--f-hand);font-size:24px;line-height:1;color:var(--ink-2);
  transform:rotate(-1.5deg);
}
.card-polaroid .cap em{color:var(--rust-700);font-style:normal}

/* photo backgrounds — fake imagery */
.card-polaroid .photo.ph-1,.pc-photo.ph-1,.frame.ph-1{background:radial-gradient(ellipse at 50% 35%, oklch(55% 0.10 200), transparent 60%), linear-gradient(180deg, oklch(20% 0.03 200), oklch(8% 0.01 200))}
.card-polaroid .photo.ph-2,.pc-photo.ph-2,.frame.ph-2{background:radial-gradient(ellipse at 55% 50%, oklch(55% 0.16 38), transparent 55%), linear-gradient(180deg, oklch(20% 0.04 38), oklch(8% 0.02 38))}
.card-polaroid .photo.ph-3,.pc-photo.ph-3,.frame.ph-3{background:radial-gradient(circle at 50% 30%, oklch(45% 0.10 200), transparent 50%), linear-gradient(180deg, oklch(18% 0.02 200), oklch(8% 0.01 200))}
.card-polaroid .photo.ph-4,.pc-photo.ph-4,.frame.ph-4{background:radial-gradient(circle at 30% 70%, oklch(40% 0.10 38), transparent 50%), radial-gradient(circle at 70% 30%, oklch(40% 0.10 200), transparent 50%), linear-gradient(180deg, oklch(18% 0.02 30), oklch(8% 0.01 200))}
.card-polaroid .photo.ph-5,.pc-photo.ph-5,.frame.ph-5{background:radial-gradient(ellipse at 70% 50%, oklch(60% 0.16 38), transparent 50%), radial-gradient(ellipse at 30% 80%, oklch(35% 0.08 200), transparent 60%), linear-gradient(180deg, oklch(18% 0.02 200), oklch(6% 0.01 200))}
.card-polaroid .photo.ph-6,.pc-photo.ph-6,.frame.ph-6{background:radial-gradient(circle at 50% 40%, oklch(70% 0.18 200), transparent 35%), radial-gradient(circle at 30% 70%, oklch(55% 0.14 38), transparent 35%), linear-gradient(180deg, oklch(14% 0.02 200), oklch(6% 0.01 200))}
.card-polaroid .photo.ph-7,.pc-photo.ph-7,.frame.ph-7{background:repeating-linear-gradient(90deg, oklch(18% 0.02 200) 0 6px, oklch(28% 0.05 200) 6px 12px), radial-gradient(circle at 50% 40%, oklch(55% 0.12 38 / .4), transparent 60%)}
.card-polaroid .photo.ph-8,.pc-photo.ph-8,.frame.ph-8{background:radial-gradient(ellipse at 50% 50%, oklch(45% 0.14 38), transparent 50%), linear-gradient(45deg, oklch(20% 0.04 38), oklch(8% 0.02 38))}

.card-polaroid .photo .scribble{font-family:var(--f-hand);font-size:42px;color:var(--teal-300);transform:rotate(-8deg);position:absolute;text-shadow:0 2px 8px rgba(0,0,0,.4)}

/* =========================================================
   STICKY NOTES
   ========================================================= */
.card-sticky{
  --sticky-bg:#f4e07a;
  --sticky-shadow:rgba(184,144,20,.45);
  background:var(--sticky-bg);color:var(--ink);
  padding:22px 20px 18px;
  border-radius:1px;
  position:relative;
  font-family:var(--f-hand);font-size:22px;line-height:1.22;
  box-shadow:0 1px 0 rgba(0,0,0,.2), 0 16px 24px -10px var(--sticky-shadow), 4px 6px 14px -6px rgba(0,0,0,.4);
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 22px) 100%, 0 100%);
}
.card-sticky::before{
  content:"";position:absolute;right:0;bottom:0;width:34px;height:24px;
  background:linear-gradient(135deg,transparent 48%,rgba(0,0,0,.18) 50%,transparent 52%);
  pointer-events:none;
}
.card-sticky.s-teal{--sticky-bg:#7fb6b3;--sticky-shadow:rgba(15,95,98,.55);color:#0a2a2a}
.card-sticky.s-rust{--sticky-bg:#e69770;--sticky-shadow:rgba(120,55,20,.55);color:#2a1408}
.card-sticky.s-paper{--sticky-bg:#ece6d8;--sticky-shadow:rgba(100,90,70,.45);color:var(--ink)}
.card-sticky.s-noir{--sticky-bg:#1a1612;--sticky-shadow:rgba(0,0,0,.7);color:var(--paper)}
.card-sticky.s-noir .meta{color:rgba(244,236,218,.6)}
.card-sticky strong{font-family:var(--f-display);font-weight:400;font-size:.85em;letter-spacing:.02em;display:block;margin-bottom:6px;font-style:normal}
.card-sticky .meta{display:flex;justify-content:space-between;margin-top:14px;padding-top:8px;border-top:1px dashed rgba(20,17,14,.2);font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(20,17,14,.55)}
.card-sticky.s-teal .meta,.card-sticky.s-rust .meta{border-top-color:rgba(0,0,0,.25);color:rgba(0,0,0,.55)}

/* =========================================================
   GIF CARDS — looped animated tiles
   ========================================================= */
.card-gif{
  background:#0a0908;border-radius:4px;overflow:hidden;
  box-shadow:0 1px 0 rgba(0,0,0,.4), 0 14px 28px -10px rgba(0,0,0,.6);
  position:relative;color:var(--paper);
}
.card-gif .frame{aspect-ratio:1/1;position:relative;overflow:hidden}
.card-gif .gif-badge{
  position:absolute;top:10px;left:10px;z-index:4;
  font-family:var(--f-mono);font-size:9px;letter-spacing:.22em;text-transform:uppercase;
  background:var(--rust-500);color:#1a0f08;padding:3px 8px;border-radius:99px;
  display:inline-flex;align-items:center;gap:5px;
}
.card-gif .gif-badge::before{
  content:"";width:6px;height:6px;border-radius:99px;background:#1a0f08;animation:gif-pulse 1.2s ease-in-out infinite;
}
@keyframes gif-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.card-gif .cap-bar{
  position:absolute;left:0;right:0;bottom:0;z-index:3;
  padding:30px 12px 10px;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.85));
  font-family:var(--f-hand);font-size:18px;color:var(--paper);
}
.card-gif .cap-bar em{color:var(--teal-300);font-style:normal}

/* Animated "loops" */
.gif-disco{background:
  radial-gradient(circle at 50% 50%, oklch(65% 0.18 200), oklch(20% 0.04 200) 70%);
  animation:gif-disco 1.6s linear infinite;
}
@keyframes gif-disco{
  0%  {background:radial-gradient(circle at 50% 50%, oklch(65% 0.18 200), oklch(20% 0.04 200) 70%)}
  33% {background:radial-gradient(circle at 50% 50%, oklch(62% 0.18 38), oklch(18% 0.04 38) 70%)}
  66% {background:radial-gradient(circle at 50% 50%, oklch(72% 0.14 280), oklch(20% 0.04 280) 70%)}
  100%{background:radial-gradient(circle at 50% 50%, oklch(65% 0.18 200), oklch(20% 0.04 200) 70%)}
}
.gif-stripe{background:repeating-linear-gradient(45deg, var(--teal-500) 0 24px, var(--rust-500) 24px 48px, var(--noir) 48px 72px);background-size:200% 200%;animation:gif-stripe 1.4s linear infinite}
@keyframes gif-stripe{from{background-position:0 0}to{background-position:96px 96px}}
.gif-bars{background:#0a0908;position:relative}
.gif-bars::before{
  content:"";position:absolute;inset:20% 12% 12% 12%;
  background:repeating-linear-gradient(90deg, var(--teal-500) 0 14px, transparent 14px 22px);
  animation:gif-bars 0.7s steps(8) infinite;mask:linear-gradient(180deg,transparent 0,#000 35%);
}
@keyframes gif-bars{0%{transform:scaleY(.6)}25%{transform:scaleY(1)}50%{transform:scaleY(.5)}75%{transform:scaleY(.9)}100%{transform:scaleY(.6)}}
.gif-bars::after{
  content:"";position:absolute;left:8%;right:8%;bottom:12%;height:1px;background:rgba(244,236,218,.5);
}
.gif-vhs{background:linear-gradient(180deg, oklch(28% 0.06 200), oklch(10% 0.02 200));position:relative;overflow:hidden}
.gif-vhs::before{
  content:"";position:absolute;inset:-10% -10% -10% -10%;
  background:repeating-linear-gradient(0deg, transparent 0 3px, rgba(244,236,218,.08) 3px 4px);
  animation:gif-vhs 6s linear infinite;
}
.gif-vhs::after{
  content:"REC ● 02:14";position:absolute;top:14px;right:14px;
  font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;color:#ff5a3d;
  animation:gif-pulse 1s ease-in-out infinite;
}
@keyframes gif-vhs{from{transform:translateY(0)}to{transform:translateY(20px)}}
.gif-strobe{background:#0a0908;position:relative}
.gif-strobe::before{
  content:"";position:absolute;inset:0;background:var(--paper);mix-blend-mode:screen;
  animation:gif-strobe 0.18s steps(2) infinite;
}
@keyframes gif-strobe{0%,55%{opacity:0}60%,100%{opacity:.7}}
.gif-strobe::after{
  content:"";position:absolute;inset:30%;border-radius:99px;
  background:radial-gradient(circle, var(--teal-300), var(--teal-700) 80%);
  filter:blur(6px);
  animation:gif-orb 2s ease-in-out infinite;
}
@keyframes gif-orb{0%,100%{transform:scale(.7)}50%{transform:scale(1.1)}}

/* =========================================================
   FLYER CARDS — mini event posters
   ========================================================= */
.card-flyer{
  background:#0a0908;color:var(--paper);border-radius:4px;overflow:hidden;
  box-shadow:0 1px 0 rgba(0,0,0,.4), 0 18px 30px -12px rgba(0,0,0,.65);
  position:relative;
  aspect-ratio:.72/1;
  padding:20px 18px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.card-flyer::after{
  content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='4' height='4'><circle cx='2' cy='2' r='.7' fill='%23000' opacity='.45'/></svg>");mix-blend-mode:multiply;pointer-events:none;z-index:1;
}
.card-flyer > *{position:relative;z-index:2}
.card-flyer .fl-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--f-mono);font-size:9px;letter-spacing:.22em;color:rgba(244,236,218,.7);text-transform:uppercase}
.card-flyer .fl-title{font-family:var(--f-display);font-size:34px;line-height:.92;letter-spacing:-.01em}
.card-flyer .fl-title .rust{color:var(--rust-500)}
.card-flyer .fl-title .it{font-family:var(--f-serif);font-style:italic;color:var(--teal-300)}
.card-flyer .fl-djs{font-family:var(--f-display);font-size:18px;line-height:1.05;color:var(--paper);margin-top:auto}
.card-flyer .fl-djs em{font-style:normal;color:var(--rust-300);display:block;font-size:.75em;margin-top:4px}
.card-flyer .fl-stamp{font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;color:rgba(244,236,218,.5);display:flex;justify-content:space-between;margin-top:10px;padding-top:8px;border-top:1px solid rgba(244,236,218,.18)}
.card-flyer .fl-stripes{display:flex;flex-direction:column;gap:3px;margin:8px 0}
.card-flyer .fl-stripes span{height:5px;background:var(--rust-500);transform:skewY(-10deg);transform-origin:left}
.card-flyer .fl-stripes span:nth-child(2){background:var(--teal-300);width:80%}
.card-flyer .fl-stripes span:nth-child(3){background:var(--rust-500);width:90%}
.card-flyer .fl-stripes span:nth-child(4){background:var(--teal-700);width:70%}
.card-flyer .fl-tag{position:absolute;top:14px;right:14px;z-index:3;background:var(--teal-500);color:#fff;font-family:var(--f-mono);font-size:9px;letter-spacing:.18em;padding:3px 8px;border-radius:99px;text-transform:uppercase}
.card-flyer .fl-rsvp{margin-top:10px}
.card-flyer .fl-rsvp .btn{padding:9px 14px;font-size:10px}

/* =========================================================
   TRACK / LINK CARDS — soundcloud/youtube clips
   ========================================================= */
.card-track{
  background:var(--paper);color:var(--ink);border-radius:6px;
  padding:14px 16px;position:relative;
  box-shadow:0 1px 0 rgba(0,0,0,.3), 0 14px 28px -10px rgba(0,0,0,.55);
  border:1px solid var(--rule);
}
.card-track .tk-head{display:flex;align-items:center;gap:10px;font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px}
.card-track .tk-head .src{padding:3px 8px;border-radius:99px;background:var(--noir);color:var(--paper);font-size:9px}
.card-track .tk-head .src.sc{background:#ff7700;color:#fff}
.card-track .tk-head .src.yt{background:#cc0000;color:#fff}
.card-track .tk-title{font-family:var(--f-display);font-size:22px;line-height:1.05;letter-spacing:-.005em;color:var(--ink);margin:4px 0 8px}
.card-track .tk-artist{font-family:var(--f-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}
.card-track .tk-wave{display:flex;align-items:flex-end;gap:2px;height:48px;margin:14px 0 10px}
.card-track .tk-wave span{flex:1;background:var(--teal-500);border-radius:1px;animation:wave 1.4s ease-in-out infinite}
.card-track .tk-wave span:nth-child(odd){background:var(--teal-700);animation-delay:.15s}
.card-track .tk-wave span:nth-child(3n){background:var(--rust-500);animation-delay:.3s}
.card-track .tk-wave span:nth-child(5n){background:var(--ink);animation-delay:.45s}
@keyframes wave{0%,100%{transform:scaleY(.3)}50%{transform:scaleY(1)}}
.card-track .tk-ctrl{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-top:8px;border-top:1px dashed var(--rule)}
.card-track .tk-play{
  width:38px;height:38px;border-radius:99px;background:var(--teal-500);color:#fff;border:0;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;font-size:14px;
  box-shadow:0 3px 0 var(--teal-700);
}
.card-track .tk-play:hover{background:var(--teal-600)}
.card-track .tk-time{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;color:var(--ink-soft)}
.card-track.dark{background:var(--noir);color:var(--paper);border-color:var(--rule-dark-soft)}
.card-track.dark .tk-title{color:var(--paper)}
.card-track.dark .tk-head,.card-track.dark .tk-artist,.card-track.dark .tk-time{color:rgba(244,236,218,.6)}
.card-track.dark .tk-ctrl{border-top-color:rgba(244,236,218,.15)}

/* =========================================================
   THREAD — clipped stack with replies
   ========================================================= */
.card-thread{position:relative}
.card-thread .reply{
  margin-top:-18px;margin-left:24px;
  transform:rotate(2.4deg);
}
.card-thread .reply.r2{margin-left:42px;transform:rotate(-1.8deg)}
.card-thread .clip{
  position:absolute;left:50%;top:-12px;transform:translateX(-50%);
  width:22px;height:32px;border:2.5px solid #c9c2b0;border-radius:7px;background:transparent;z-index:5;
  box-shadow:inset 0 -2px 0 rgba(0,0,0,.15);
}
.card-thread .clip::after{
  content:"";position:absolute;left:50%;top:6px;width:1.5px;height:16px;background:#c9c2b0;transform:translateX(-50%);
}

/* =========================================================
   TICKET-LIKE GIVEAWAY CARD
   ========================================================= */
.card-ticket{
  background:var(--paper);color:var(--ink);border-radius:6px;display:grid;grid-template-columns:1fr 14px 110px;overflow:hidden;
  box-shadow:0 1px 0 rgba(0,0,0,.3), 0 14px 28px -10px rgba(0,0,0,.55);min-height:150px;
}
.card-ticket .t-perf{background:repeating-linear-gradient(180deg,var(--rule) 0 4px,transparent 4px 8px)}
.card-ticket .tk-l{padding:14px 16px;display:flex;flex-direction:column;gap:6px}
.card-ticket .tk-r{padding:14px;background:var(--ink);color:var(--paper);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end}
.card-ticket .tk-r .kicker{color:rgba(244,236,218,.7)}
.card-ticket .tk-title{font-family:var(--f-display);font-size:22px;line-height:.95;letter-spacing:-.005em}
.card-ticket .tk-num{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;color:var(--paper)}
.card-ticket .tk-dot{width:16px;height:16px;border-radius:99px;background:var(--teal-500)}

/* =========================================================
   POSTCARD — landscape photo + handwritten note
   ========================================================= */
.card-postcard{
  background:#f7f1e3;color:var(--ink);border-radius:3px;overflow:hidden;
  display:grid;grid-template-columns:1fr 1fr;min-height:180px;
  box-shadow:0 1px 0 rgba(0,0,0,.35), 0 14px 28px -10px rgba(0,0,0,.6);position:relative;
}
.card-postcard .pc-photo{position:relative;overflow:hidden}
.card-postcard .pc-photo::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='3' height='3'><circle cx='1.5' cy='1.5' r='.6' fill='%23000' opacity='.4'/></svg>");mix-blend-mode:multiply}
.card-postcard .pc-text{padding:16px 14px;display:flex;flex-direction:column;gap:8px;border-left:1.5px dashed rgba(20,17,14,.25);position:relative}
.card-postcard .pc-text::before{content:"";position:absolute;left:14px;right:14px;top:50%;height:1.5px;background:rgba(20,17,14,.18)}
.card-postcard .pc-note{font-family:var(--f-hand);font-size:18px;line-height:1.15;color:var(--ink-2)}
.card-postcard .pc-to{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-top:auto}
.card-postcard .stamp{
  position:absolute;top:10px;right:10px;width:46px;height:54px;
  background:var(--rust-500);color:var(--paper);
  display:flex;align-items:center;justify-content:center;font-family:var(--f-display);font-size:18px;
  border:3px dashed rgba(247,241,227,.7);
  transform:rotate(6deg);
}

/* =========================================================
   FOOTER
   ========================================================= */
.bd-foot{max-width:1480px;margin:0 auto;padding:20px 32px 36px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;border-top:1px solid var(--rule-dark-soft)}
.bd-foot .kicker{color:rgba(244,236,218,.55)}
.bd-foot u{text-decoration:none;color:var(--teal-300)}

/* ensure btn-link readable on dark wall in wall-end */
.wall-end .btn-link{color:var(--teal-300);border-bottom-color:var(--teal-500)}